<template>
	<MainContent>
		<template v-slot:title>
			<el-page-header @back="back" content="新增字典分类"></el-page-header>
		</template>
		<div style="padding: 16px">
			<el-row>
				<el-col :span="12">
					<el-form ref="dictCategoryForm" :model="dictCategory" :rules="rules" label-width="120px" size="small">
						<el-form-item label="分类编码" prop="code">
							<el-input type="text" v-model="dictCategory.code" placeholder="请输入字典分类标识"></el-input>
						</el-form-item>
						<el-form-item label="分类名称" prop="name">
							<el-input type="text" v-model="dictCategory.name" placeholder="请输入字典分类名称"></el-input>
						</el-form-item>
						<el-form-item label="系统内置" prop="inner">
							<el-select v-model="dictCategory.inner">
								<el-option label="是" value="1"></el-option>
								<el-option label="否" value="0"></el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="备注" prop="remarks">
							<el-input type="textarea" resize="none" rows="8" v-model="dictCategory.remarks" placeholder="请输入文本内容"></el-input>
						</el-form-item>
						<el-form-item class="pull-right">
							<el-button @click="back">取消</el-button>
							<el-button type="primary" @click="submitForm">提交</el-button>
						</el-form-item>
					</el-form>
				</el-col>
			</el-row>
		</div>
	</MainContent>
</template>

<script>
import MainContent from "@/components/common/MainContent";
export default {
	name: "DictCategoryForm",
	components: {MainContent},
	data() {
		return {
			dictCategory: {
				id: "",
				code: "",
				name: "",
				inner: "1",
				remarks: ""
			},
			rules: {
				code: [{ required: true, message: "请输入字典分类编码", trigger: "blur"}],
				name: [{ required: true, message: "请输入字典分类名称", trigger: "blur"}]
			}
		}
	},
	methods: {
		back() {
			this.resetForm();
			this.$router.replace("/dict");
		},
		resetForm() {
			let form = this.$refs["dictCategoryForm"];
			form.resetFields();
			form.clearValidate();
		},
		submitForm() {
			this.axios({
				method: "post",
				url: "/sys/dict/addDictCategory",
				params: {...this.dictCategory}
			}).then(response => {
				if (response.status === 200) {
					let result = response.data;
					if (result.code === 200) {
						this.$message({
							message: "保存成功",
							type: "success",
							onClose: this.resetForm()
						})
					} else {
						this.$message({
							message: `保存失败， {result.data}`,
							type: "success",
							onClose: this.resetForm()
						})
					}
				}
			})
		}
	},
	created() {
		// this.dictCategory.inner = "1"
	}
}
</script>

<style scoped>

</style>
